add task solution #3982
add task solution #3982
Conversation
There was a problem hiding this comment.
Great job on implementing the task requirements! 🎉 Your code is well-structured and meets the core requirements effectively. Just make sure that all SCSS variables like $font-size, $cell-border, $calendar-padding, $cell-size, and $gap are defined to avoid any compilation issues. Keep up the good work! 😊
✨ Please rate this review in the Platform's notification center. I will be grateful for your feedback! ✨
| .calendar { | ||
| display: flex; | ||
| flex-wrap: wrap; | ||
| gap: $gap; |
There was a problem hiding this comment.
Ensure that the variable $gap is defined in your SCSS files. If it's missing, it will cause a compilation error.
| display: flex; | ||
| flex-wrap: wrap; | ||
| gap: $gap; | ||
| width: calc(7 * $cell-size + 6 * $gap); |
There was a problem hiding this comment.
Ensure that the variable $cell-size is defined in your SCSS files. If it's missing, it will cause a compilation error.
| flex-wrap: wrap; | ||
| gap: $gap; | ||
| width: calc(7 * $cell-size + 6 * $gap); | ||
| padding: $calendar-padding; |
There was a problem hiding this comment.
Ensure that the variable $calendar-padding is defined in your SCSS files. If it's missing, it will cause a compilation error.
| width: $cell-size; | ||
| height: $cell-size; | ||
| background-color: #eee; | ||
| border: $cell-border solid black; |
There was a problem hiding this comment.
Ensure that the variable $cell-border is defined in your SCSS files. If it's missing, it will cause a compilation error.
| left: 50%; | ||
| transform: translate(-50%, -50%); | ||
| font-family: Arial, sans-serif; | ||
| font-size: $font-size; |
There was a problem hiding this comment.
Ensure that the variable $font-size is defined in your SCSS files. If it's missing, it will cause a compilation error.
DEMO LINK
TEST REPORT LINK
Changing 'month-lengh' and 'start-day' modifier in the code element
reflects in changing calendar layout
Each day has no modifiers, only class (eg. calendar__day)
All
Typical MistakesfromBEMlesson theory are checked.Code follows all the Code Style Rules ❗️